<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="//apps.bdimg.com/libs/jqueryui/1.10.4/css/jquery-ui.min.css">
    <script src="//apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="//apps.bdimg.com/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
    <!--    <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>-->
    <script type="text/javascript" src="https://g.alicdn.com/dingding/dingtalk-jsapi/2.10.3/dingtalk.open.js"></script>
    <link rel="stylesheet" type="text/css" href="../css/style.css">
    <link rel="stylesheet" href="http://jqueryui.com/resources/demos/style.css">
</head>
<script>
    function search(){
        var object = $("#object").val();
        $.ajax({
            type:"post",
            url:"/selectResourceByAll",
            dataType: "json",
            data:{
                "object":object,
            },
            success:function(list){
                alert("search成功！")
                showData(list);
                alert("show成功！")
            },
            error:function (msg){
                alert("search失败:搜索条件为空。");
            }
        });
    }

    function showData(jsonArray){
        //清空table
        var table = document.getElementById("tab");
        arr = table.getElementsByTagName("tr");
        //不能用i++的方式去删除，双数行删不掉，删掉第一行的时候第二行变成第一行，下一次删的是第三行。
        //所以采用从最后开始的删除方法。
        for(var i=arr.length-1;i>0;i--){
            table.deleteRow(i);
        }

        var str = "";
        var length=jsonArray.length;
        for (var i=0;i<length;i++){
            if (jsonArray[i].uid==0){
                jsonArray[i].uid="";
            }
            if (jsonArray[i].uname==null){
                jsonArray[i].uname="";
            }
            if (jsonArray[i].storage==null){
                jsonArray[i].storage="";
            }
            if (jsonArray[i].uid==0){
                jsonArray[i].uid="";
            }
            if (jsonArray[i].price==0||jsonArray[i].price==null){
                jsonArray[i].price="";
            }
            if (jsonArray[i].borrowtime==null){
                jsonArray[i].borrowtime="";
            }
            str = "<tr><td>"+jsonArray[i].rnum+"</td><td>"
                +jsonArray[i].rname+"</td><td>"
                +jsonArray[i].rstatus+"</td><td>"
                +jsonArray[i].rtype+"</td><td>"
                +jsonArray[i].brand+"</td><td>"
                +jsonArray[i].model+"</td><td>"
                +jsonArray[i].price+"</td><td>"
                +jsonArray[i].registime+"</td><td>"
                +jsonArray[i].borrowtime+"</td><td>"
                +jsonArray[i].uid+"</td><td>"
                +jsonArray[i].uname+"</td><td>"
                +jsonArray[i].storage+"</td><td>"
                +jsonArray[i].manage_uid+"</td><td>"
                +jsonArray[i].tips+"</td><tr>"
            $("#tab").append(str)
        }
    }

    $(function() {
        $.ajax({
            url: "/showAllResource",
            type: "post",
            dataType: "json",
            success: function (jsonArray) {
                showData(jsonArray);
            },
            error: function (msg) {
                alert("ajax失败:" + msg);
            }
        });

        $("#search").click(function () {
            search();
        });
    })



</script>
<body>
<div>
    <form class="content" id="cont2">
        <label>查询内容</label>
        <input type="text" name="object" id="object" value="">
        <button type="button" id="search">搜索</button>
    </form>
</div>
<table id="tab" border="1px" >
    <tr>
        <td width="40px">编号</td>
        <td width="80px">名称</td>
        <td width="40px">状态</td>
        <td width="40px">类型</td>
        <td width="40px">品牌</td>
        <td width="40px">型号</td>
        <td width="40px">价格</td>
        <td width="80px">注册时间</td>
        <td width="80px">借用时间</td>
        <td width="40px">工号</td>
        <td width="40px">用户</td>
        <td width="40px">存储地</td>
        <td width="40px">管理人</td>
        <td width="100px">备注</td>
    </tr>
</table>
</body>
</html>